<!--
  Copyright (c) 2018-2999 广州市蓝海创新科技有限公司 All rights reserved.

  https://www.mall4j.com/

  未经允许，不可做商业用途！

  版权所有，侵权必究！
-->

<template>
  <view class="Mall4j page-index content home">
    <!-- 头部信息 -->
    <view
      v-if="isLoad"
      class="shop-info mb-30"
    >
      <view class="info-item shop">
        <view class="shop-name">
          <text>
            {{ shopInfo.shopName }}
            <text
              v-if="shopInfo.shopStatus === -1"
              class="status"
            >
              已删除
            </text>
            <text
              v-else
              class="status"
            >
              ({{
                [
                  '停业中',
                  '营业中',
                  '违规下线',
                  '上线待审核',
                  '开店申请中',
                  '开店申请待审核'
                ][shopInfo.shopStatus]
              }})
            </text>
          </text>
        </view>
        <view class="share">
          <view
            class="scan-code"
            @tap="scanCode"
          >
            <image
              style="width: 100%; height: 100%"
              src="/static/images/scan-code.png"
              mode="aspectFit"
            />
          </view>
          <view
            class="share-store"
            @tap="openSharePop"
          >
            <image
              style="width: 100%; height: 100%"
              src="/static/images/share-store.png"
              mode="aspectFit"
            />
          </view>
        </view>
      </view>
      <view class="info-item income">
        <view class="income-title">
          今日支付金额(元)
        </view>
        <view class="income-amount">
          {{ todayPayedInfo.payActualTotal }}
        </view>
      </view>
      <view class="info-item order">
        <text>今日订单: {{ todayPayedInfo.payOrderCount }},</text>
        <text>待发货: {{ orderCountInfo.payed }}</text>
      </view>
    </view>
    <!-- 余额信息 -->
    <view
      v-if="isLoad"
      class="shop-balance"
    >
      <view class="balance-item">
        <view class="balance-title">
          店铺可用余额(元)
        </view>
        <view class="balance-amount">
          {{ shopWalletInfo.settledAmount }}
        </view>
      </view>
      <view class="balance-item">
        <view class="balance-title">
          待结算金额(元)
        </view>
        <view class="balance-amount">
          {{ shopWalletInfo.unsettledAmount }}
        </view>
      </view>
    </view>
    <!-- 快捷入口 -->
    <view class="shortcut-entrance mb-30">
      <view class="title mb-30">
        店铺小助手
      </view>
      <template
        v-for="(item, index) in shortcutList"
        :key="index"
      >
        <view
          v-if="item.Authorities === true || isAuthorities(item.Authorities)"

          class="shortcut-item"
          @tap="shortcutTap(item.url)"
        >
          <image
            class="item-icon"
            :src="item.icon"
          />
          <view class="item-info">
            <view class="item-title">
              {{ item.title }}
            </view>
            <view class="item-desc">
              {{ item.desc }}
            </view>
          </view>
          <uni-icons
            class="ml-auto"
            type="arrowright"
            color="#2B4499"
          />
        </view>
      </template>
    </view>
    <!-- 分享店铺弹窗 -->
    <share-shop-popup
      v-if="isShareShopPopupShow"
      ref="sharePopupRef"
      :shop-info="shopInfo"
      :is-wechat="isWechat"
      @open-guide-share="openGuideShare"
      @close-share-pop="closeSharePop"
    />
    <!-- 引导分享蒙版 -->
    <view
      v-if="guideShare"
      class="guide-share-mask"
    >
      <view class="mask" />
      <view class="guide-content">
        <view
          class="close"
          @tap="guideShare = false"
        >
          <image src="../../static/images/close.png" />
        </view>
        <view class="share-img">
          <image src="../../static/images/shareIcon.png" />
        </view>
        <view class="share-word">
          <view class="big-word">
            立即分享给好友
          </view>
          <view class="small-word">
            点击屏幕右上角将本店铺分享给好友
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup>
const { isAuthorities } = util
const isLoad = ref(false)
const shortcutList = [
  {
    icon: '../../static/images/order-management.png',
    title: '订单管理',
    desc: '订单发货、订单退款',
    url: '/package-order/pages/order/order',
    Authorities: 'manageOrders:view'
  },
  {
    icon: '../../static/images/product-release.png',
    title: '商品管理',
    desc: '编辑、发布新商品',
    url: '/package-prod/pages/prod-management/prod-management',
    Authorities: 'prod:prod:manage:view'
  },
  {
    icon: '../../static/images/store-billing.png',
    title: '店铺结算',
    desc: '店铺资产、余额提现',
    url: '/pages/shop-settlement/shop-settlement',
    Authorities: 'shop:shopWalletLog:view'
  },
  {
    icon: '../../static/images/product-ranking.png',
    title: '商品排行',
    desc: '支付、访问、退款排行',
    url: '/pages/product-ranking/product-ranking',
    Authorities: true
  }
]
const shopInfo = ref({})
const todayPayedInfo = ref({
  payActualTotal: 0,
  payOrderCount: 0
})
const orderCountInfo = ref({
  payed: 0
})
const shopWalletInfo = ref({
  settledAmount: 0,
  unsettledAmount: 0
})
const isShareShopPopupShow = ref(false)
const guideShare = ref(false)
const isWechat = ref(false)
onLoad(() => {
  // 判断是否为微信环境
  // #ifdef H5
  isWechat.value = wechat.isWechat()
  // #endif
  // #ifdef APP-PLUS
  isWechat.value = false
  // #endif
  // #ifdef MP-WEIXIN
  isWechat.value = true
  // #endif
})
onShow(() => {
  clearData()
  // 获取今日支付信息数量
  getTodayPayedInfo()
  // 获取订单数量
  getOrderCount()
  // 获取店铺余额信息
  getShopWalletInfo()
  // 获取店铺信息
  getShopInfo()
})

const closeSharePop = () => {
  isShareShopPopupShow.value = false
}
const clearData = () => {
  shopWalletInfo.value = {
    settledAmount: 0,
    unsettledAmount: 0
  }
  orderCountInfo.value = {
    payed: 0
  }
  todayPayedInfo.value = {
    payActualTotal: 0,
    payOrderCount: 0
  }
}
/**
 * 获取店铺信息
 */
const getShopInfo = () => {
  const params = {
    url: '/shop/shopDetail/info',
    method: 'GET'
  }
  http.request(params).then(({ data: res }) => {
    isLoad.value = true
    shopInfo.value = res
  })
}

/**
 * 获取今日支付信息数量
 */
const getTodayPayedInfo = () => {
  const params = {
    url: '/shop/statisticsOrder/orderPayByShopId',
    method: 'GET'
  }
  http.request(params).then(({ data: res }) => {
    todayPayedInfo.value = res
  })
}

/**
 * 获取订单数量
 */
const getOrderCount = () => {
  const params = {
    url: '/shop/statisticsOrder/orderCount',
    method: 'GET'
  }
  http.request(params).then(({ data: res }) => {
    orderCountInfo.value = res
  })
}

/**
 * 获取店铺余额信息
 */
const getShopWalletInfo = () => {
  const params = {
    url: '/shop/shopWallet/info',
    method: 'GET',
    callBack: (res) => {
      if (!res) return
      shopWalletInfo.value = res
    }
  }
  http.request(params).then(({ data: res }) => {
    if (!res) return
    shopWalletInfo.value = res
  })
}

/**
 * 快捷入口跳转
 */
const shortcutTap = (url) => {
  if (!url) {
    return
  }
  uni.navigateTo({
    url
  })
}

// 扫码核销
const scanCode = () => {
  // #ifdef H5
  // 判断是否为微信内嵌浏览器
  if (!wechat.isWechat()) {
    uni.showToast({
      title: '请在微信浏览器打开',
      icon: 'none'
    })
    return
  }
  wechat.scanQRCode(
    (codeStr) => {
      const code = codeStr.indexOf(',') > -1 ? codeStr.split(',')[1] : codeStr
      uni.navigateTo({
        url: '/pages/scan-pick/scan-pick?pickCode=' + code
      })
    },
    (err) => {
      alert(JSON.stringify(err))
      uni.showToast({
        title: '唤起扫码失败，请稍后重试',
        icon: 'none'
      })
    }
  )
  // #endif
  // #ifdef APP-PLUS || MP-WEIXIN
  uni.scanCode({
    success (res) {
      // 判断扫码结果是否为纯数字
      if (!/^\d+$/.test(res.result)) {
        uni.showModal({
          title: '提示',
          content: '请扫描正确的核销码',
          confirmText: '确定',
          showCancel: false
        })
        return
      }
      uni.navigateTo({
        url: '/pages/scan-pick/scan-pick?pickCode=' + res.result
      })
    },
    fail: () => {
    }
  })
  // #endif
}
const sharePopupRef = ref(null)
// 打开分享弹窗
const openSharePop = () => {
  isShareShopPopupShow.value = true
  nextTick(() => {
    sharePopupRef.value?.openSharePop()
  })
}
// 打开分享引导蒙版
const openGuideShare = () => {
  guideShare.value = true
}

</script>

<style lang="scss" scoped>
@import './index.scss';
</style>
